<template>
  <div class="topR">
    <template v-if="activeTab === `${$t('maintenance.Tobeallocated')}`">
      <template v-if="englishStatus">
        <img src="@/assets/images/equipment/Edistribution.png" />
      </template>
      <template v-else>
        <img src="@/assets/images/equipment/distribution.png" />
      </template>
    </template>
    <template v-if="activeTab === `${$t('maintenance.Tobemaintained')}`">
      <template v-if="englishStatus">
        <img src="@/assets/images/equipment/Ewaitmaintenance.png" />
      </template>
      <template v-else>
        <img src="@/assets/images/equipment/waitmaintenance.png" />
      </template>
    </template>
    <template v-if="activeTab === `${$t('maintenance.Undermaintenance')}`">
      <template v-if="englishStatus">
        <img src="@/assets/images/equipment/EInthemaintenance.png" />
      </template>
      <template v-else>
        <img src="@/assets/images/equipment/Inthemaintenance.png" />
      </template>
    </template>
    <template v-if="activeTab === `${$t('maintenance.Tobeconfirmed')}`">
      <template v-if="englishStatus">
        <img src="@/assets/images/equipment/ETobeconfirmed.png" />
      </template>
      <template v-else>
        <img src="@/assets/images/equipment/Tobeconfirmed.png" />
      </template>
    </template>
    <template v-if="activeTab === `${$t('maintenance.Statement')}`">
      <template v-if="englishStatus">
        <img src="@/assets/images/equipment/Eclosecase.png" />
      </template>
      <template v-else>
        <img src="@/assets/images/equipment/statement.png" />
      </template>
    </template>
    <template v-if="activeTab === `${$t('maintenance.Expired')}`">
      <template v-if="englishStatus">
        <img src="@/assets/images/equipment/Eoverdue.png" />
      </template>
      <template v-else>
        <img src="@/assets/images/equipment/overdue.png" />
      </template>
    </template>
    <template v-if="activeTab === `${$t('maintenance.Closed')}`">
      <template v-if="englishStatus">
        <img src="@/assets/images/equipment/Eclosecase.png" />
      </template>
      <template v-else>
        <img src="@/assets/images/equipment/closecase.png" />
      </template>
    </template>
  </div>
</template>

<script>
export default {
  name: "orderStatusIcon",
  props: ["status", "activeTab"],
  data() {
    return {
      englishStatus: false,
    };
  },
  created() {
    if (localStorage.getItem("language") === "zh_CN") {
      this.englishStatus = false;
    } else {
      this.englishStatus = true;
    }
    if (!this.activeTabInfo) {
      ``;
      this.$store.commit(
        "detail/SET_ACTIVETAB",
        `${this.$t("maintenance.Tobeallocated")}`
      );
    }
  },
};
</script>

<style scoped lang="scss">
img {
  width: 100%;
  height: auto;
  overflow: hidden;
}
</style>
